// mela onlie 购物车界面 订制
import { PureComponent } from "react";
import { Button, Modal } from "antd-mobile"
import { connect } from 'dva';
import { InputItem } from 'antd-mobile';
import { ActivityIndicator } from 'antd-mobile';
import { handleImg, isNull, backToPrevious,goToPage } from "../../utils/helper";
import MToast from '../../components/Util/MToast';
import {IntlProvider, addLocaleData,FormattedMessage} from 'react-intl';
import localeData from '../../../public/lang/data.json';
import "./PlaceOrder.less"
@connect(() => {
  return ({

  })
})
export default class ModifyAddress extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      recivier: "",//(收货人)
      street: "",//(街道)
      city: "",//(城市)
      district: "",//(行政区)
      country: "IT",//(国家)
      post_code: "",//(邮编)
      concat: "",//(联系电话)
      objItems:[],
      loading:true,
    }
  }
  componentWillMount() {
    let { dispatch, location } = this.props;
    const query = location.search;
    console.log(query)
    const modify_id = query.substr(4);
    console.log(modify_id)
    dispatch({
      type: "global/setHeaderTitle",
      payload: {
        title: T(localeData[localStorage.locale].modifyAddressTitle),
        path: location.pathname + location.search
      }
    });
    dispatch({
      type: "form/query",
      payload: {
        apiInfo: {
          url: "/qry/all?_c=app_user_address_list",
          params: [
          ],
          _c: "app_user_address_list"
        },
        callback: (result) => {
          let{addressItems}=this.state;
          let { data } = result;

            data.map((item)=>{
              if(item.id==modify_id){
                console.log("dfsefefr")
                this.setState({
                  recivier:item.recivier,//(收货人)
                  street:item.street,//(街道)
                  city: item.city,//(城市)
                  district:item.district,//(行政区)
                  country: "IT",//(国家)
                  post_code:item.post_code,//(邮编)
                  concat:item.concat,//(联系电话)
                  loading:false
                })
              }
            })
        }
      }
    })
  }

  componentDidMount() {

  }
  modifyAddress = () => {
    let { recivier, street, city, district, country, post_code, concat,objItems } = this.state;
    let { dispatch, location } = this.props;
    const query = location.search;
    console.log(query)
    const modify_id = query.substr(4);
    if (isNull(recivier)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressName), 3, null, false);
      return;
    }
    if (isNull(street)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressStreet), 3, null, false);
      return;
    }
    if (isNull(city)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressCity), 3, null, false);
      return;
    }
    if (isNull(district)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressDistrict), 3, null, false);
      return;
    }
    if (isNull(post_code)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressPostcode), 3, null, false);
      return;
    }
    if (isNull(concat)) {
      MToast.fail(T(localeData[localStorage.locale].addAddressConcat), 3, null, false);
      return;
    }
    dispatch({
      type: "form/query",
      payload: {
        apiInfo: {
          url: "/ent/update?_c=app_user_address",
          params: [
            {
              key: "id",
              value: modify_id
            },
            {
              key: "recivier",
              value: recivier
            },
            {
              key: "street",
              value: street
            },
            {
              key: "city",
              value: city
            },
            {
              key: "district",
              value: district
            },
            {
              key: "country",
              value: "IT"
            },
            {
              key: "post_code",
              value: post_code
            },
            {
              key: "concat",
              value: concat
            }
          ],
          _c: "app_user_address"
        },
        callback: (result) => {
          let { data } = result;
          var obj={
            id:modify_id,
            recivier:recivier,
            street:street,
            city:city,
            district:district,
            country:'IT',
            post_code:post_code,
            concat:concat
          }

          // localStorage.setItem(MI_APP_CODE + "cart_address",JSON.stringify(obj));
          localStorage.setItem(MI_APP_CODE + "cart_address",JSON.stringify(obj));
          localStorage.setItem("saveId",modify_id);
          // goToPage({ dispatch, config: { url: "/addressList" }, isReplace: false })
          backToPrevious();
          // goToPage({ dispatch, config: { url: "/placeOrder" }, isReplace: false })
          // window.location.reload('./addressList');
        }
      }
    })

    // goToPage({ dispatch, config: { url: "/placeOrder" }, isReplace: false })
  }
  render() {
    let { recivier, street, city, district, country, post_code, concat,loading } = this.state;
    const messages = localeData[localStorage.locale];
    if (loading) {
      return (
        <div className="normal">
          <ActivityIndicator toast text="正在加载" animating={true} />
        </div>
      )
    }
    return (
      <IntlProvider
        locale={ localStorage.locale } messages={messages}
      >
      <div className="normal" style={{ background: "#fff", height: "100%" }}>
        <div style={{padding:'17px 16px',}}>
          <div style={{color:'#2E2D35',fontSize:'17px',fontWeight:'bold',marginBottom:'25px'}}>{messages.modifyAddressTitle}</div>
          <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px'}}>
            <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressStreet1}</div>
            <InputItem
              clear
              value={street}
              onChange={(e) => {
                this.setState({
                  street: e
                })
              }}
              className="required"
              placeholder={T(messages.addAddressStreet1)}
            ></InputItem>
          </div>
          <div style={{}}>
            <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px',marginRight:'5%',width:'45%',display:'inline-block'}}>
              <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressPostcode1}</div>
              <InputItem
                clear
                value={post_code}
                onChange={(e) => {
                  this.setState({
                    post_code: e
                  })
                }}
                className="required"
                placeholder={T(messages.addAddressPostcode1)}
              ></InputItem>
            </div>
            <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px',width:'49%',display:'inline-block'}}>
              <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressDistrict1}</div>
              <InputItem
                clear
                value={district}
                onChange={(e) => {
                  this.setState({
                    district: e
                  })
                }}
                className="required"
                placeholder={T(messages.addAddressDistrict1)}
              ></InputItem>
            </div>
          </div>
          <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px'}}>
            <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressCity1}</div>
            <InputItem
              clear
              value={city}
              onChange={(e) => {
                this.setState({
                  city: e
                })
              }}
              className="required"
              placeholder={T(messages.addAddressCity1)}
            ></InputItem>
          </div>
          <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px'}}>
            <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressName1}</div>
            <InputItem
              clear
              value={recivier}
              onChange={(e) => {
                this.setState({
                  recivier: e
                })
              }}
              className="required"
              placeholder={T(messages.addAddressName1)}
            ></InputItem>
          </div>
          <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px'}}>
            <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressCuntry1}</div>
            <InputItem
              clear
              disabled
              value="IT"
              className="required"
              placeholder={T(messages.addAddressCuntry1)}
            ></InputItem>
          </div>

          <div style={{border:'1px solid #EEEDF2',borderRadius:'5px',position:'relative',marginBottom:'25px'}}>
            <div style={{color:'#9C9BAB',fontSize:'11px',position:'absolute',top:'-19px',left:'23px',zIndex:'10',background:'#fff',padding:'8px'}}>{messages.addAddressConcat1}</div>
            <InputItem
              clear
              value={concat}
              onChange={(e) => {
                this.setState({
                  concat: e
                })
              }}
              className="required"
              placeholder={T(messages.addAddressConcat1)}
            ></InputItem>
          </div>


          <Button size="default" type="primary" style={{ width: "80%", background:'#F09600',border:'0',borderRadius:'20px', fontSize: "18px",margin:'0 auto',height:'42px',lineHeight:"42px" }}
            onClick={() => {
              this.modifyAddress()
            }}
          >{T(messages.addAddressSave1)}</Button>
        </div>
      </div >
      </IntlProvider>
    )
  }
}
